{% extends "base.html" %}

{% block content %}
<div id="topics">
<h2>Add / Edit Article</h2>
<br/>
<!-- TinyMCE -->
<script type="text/javascript" src="scripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript" src="/scripts/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $("#datepicker").datepicker({dateFormat: 'yy-mm-dd', defaultDate: null});
});
    </script>
<script type="text/javascript">
	tinyMCE.init({
		mode : "specific_textareas",
        editor_selector : "mceEditor",
		theme : "advanced",
        extended_valid_elements : "iframe[align<bottom?left?middle?right?top|class|frameborder|height|id|longdesc|marginheight|marginwidth|name|scrolling<auto?no?yes|src|style|title|width]"
	});
</script>
<!-- /TinyMCE -->

<div id="entryform">
    {% if article.key %}<a href="/article?key={{ article.key }}">Preview article</a>{% endif %}
          <form action="/editarticle" method="post" onsubmit="return validate_postarticle(this)">
            <fieldset>
            <label>Title:</label>
            <input class="textbox" name="title" rows="1" value="{{ article.title }}"><br>

            <label>Date:</label>
            <input id="datepicker" name="date" type="text" value="{{ article.date|date:"Y-m-d" }}"/></input> (YYYY-MM-DD)<br>
            
            <label>Summary:</label>
            <textarea name="summary" rows="4">{{ article.summary }}</textarea>
            
            <label>Image URL:</label>
            <input  class="textbox" name="imagelink" rows="1" value="{% if defaultimage %}{{ defaultimage }}{% endif %}{% if article.imagelink %}{{ article.imagelink }}{% endif %}"></input>
{% if article.imagelink %}
            <label>Image:</label>
            <img src="{{ article.imagelink }}">
{% endif %}
            <label>Content:</label>
            <textarea name="content" rows="15" class="mceEditor">{{ article.content }}</textarea>
            <label>Article Type:</label>
                <select class="listbox" name="type">
                    <option value="Editorial" {% ifequal article.type "Editorial" %}selected="selected"{% endifequal %}>Editorial</option>
                    <option value="Commented Link" {% ifequal article.type "Commented Link" %}selected="selected"{% endifequal %}>Commented Link</option>
                    <option value="Feature" {% ifequal article.type "Feature" %}selected="selected"{% endifequal %}>Feature</option>
                </select><br>
            
            <label>Categories:</label>
                {% for navcategory in navcategories %}
                <input type="checkbox" name="categories" value="{{ navcategory }}" {% for category in article.categories %}{% ifequal category navcategory %}checked="checked"{% endifequal %}{% endfor %}>{{ navcategory }}</input>
                {% endfor %}
            <br>
            <label>Published?:</label>
            <input class="checkbox" name="published" type="checkbox" {% if article.published %}checked="checked"{% endif %}/><br>
            
            <label>Main Feature?:</label>
            <input class="checkbox" name="mainfeature" type="checkbox" {% if article.mainfeature %}checked="checked"{% endif %}/><br>
            <label></label>
            <input type="submit" name="action" value="Save Article">{% if article.key %}<input type="submit" name="action" value="Delete" onclick="return confirm('Are you sure you want to permanently delete this Aritcle?');"/>{% endif %}
            <input type="hidden" name="articlekey" value="{{ article.key }}">
            </fieldset>
          </form>
</div>

</div>
{% endblock %}